<template>
  <div class="page-style">
    <btn-area @reloadFun="reloadFun" @searchFun="searchFun" />
    <table-area :table-data="userList" @reloadFun="reloadFun" />
    <pagination :total="total" @pagination="pagination" />
  </div>
</template>

<script>
import btnArea from './components/bar-code-scanning-gun/btn-area'
import tableArea from './components/bar-code-scanning-gun/gun-tab'
import pagination from '@/components/Pagination'
import { getBarCodeScanningGunListApi } from '@/api/system'
export default {
  components: {
    btnArea,
    tableArea,
    pagination
  },
  data() {
    return {
      total: 0,
      p: 1,
      num: 10,
      userList: [],
      name: '',
      user_name: '',
      status: 1,
      brand_id: ''
    }
  },
  created() {
    this.getGunsUserList()
  },
  methods: {
    pagination(val) {
      this.p = val.page
      this.num = val.limit
      this.getGunsUserList()
    },
    getGunsUserList() {
      const data = {
        p: this.p,
        num: this.num,
        name: this.name,
        user_name: this.user_name,
        status: this.status,
        brand_id: this.brand_id
      }
      getBarCodeScanningGunListApi(data).then(res => {
        console.log(res)
        this.total = Number(res.count)
        this.userList = res.list
      })
    },
    reloadFun() {
      this.getGunsUserList()
    },
    searchFun(val) {
      console.log(val)
      this.user_name = val.user_name
      this.name = val.name
      this.brand_id = val.brand_id
      this.getGunsUserList()
    }
  }

}
</script>

<style lang="sass" scoped>

</style>
